package com.hippo.core.ui.components

import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

@Composable
fun CodeLayout(modifier: Modifier = Modifier, onCodeChange: (String) -> Unit) {

    var code1 by remember { mutableStateOf("") }
    var code2 by remember { mutableStateOf("") }
    var code3 by remember { mutableStateOf("") }
    var code4 by remember { mutableStateOf("") }
    var code5 by remember { mutableStateOf("") }
    var code6 by remember { mutableStateOf("") }

    Row(
        modifier = modifier.padding(vertical = 10.dp)
    ) {

        Spacer(modifier = Modifier.weight(2F))

        SimpleTextEdit(
            value = code1,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code1 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(1F))

        SimpleTextEdit(
            value = code2,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code2 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(1F))

        SimpleTextEdit(
            value = code3,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code3 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(1F))

        SimpleTextEdit(
            value = code4,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code4 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(1F))

        SimpleTextEdit(
            value = code5,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code5 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(1F))

        SimpleTextEdit(
            value = code6,
            hint = "",
            modifier = Modifier.size(45.dp),
            onValueChange = {
                code6 = it
                val code = "$code1$code2$code3$code4$code5$code6"
                onCodeChange(code)
            }
        )

        Spacer(modifier = Modifier.weight(2F))

    }


}


@Preview(showBackground = true)
@Composable
private fun CodeEditPreview() {
    CodeLayout(){}
}